@keyframes open {
  from {
    transform: scale(0);
  }
  to {
    transform: scale(1);
  }
}

@keyframes close {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(0);
  }
}

@radio-prefix: ~"@{css-prefix}-radio";
.@{radio-prefix} {
  flex-direction: column;
  background-color: @radio-default-bg;
  &__item {
    padding: 30px 40px;
    .set-border(bottom, @radio-default-border);
  }
  &__item--disabled {
    opacity: .3;
  }
  &__item--isRight {
    justify-content: space-between;
  }
  &__check {
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    border-radius: 45px;
    border: 1px solid @radio-default-border;
    margin-right: 10px;
  }
  &__thumb {
    width: 12px;
    height: 26px;
    .set-border(right, @radio-default-border, 3px);
    .set-border(bottom, @radio-default-border, 3px);
    transform: rotate(45deg);
    margin-top: -5px;
  }
  &__thumb--open {
    animation-name: open;
    animation-duration: 0ms;
    animation-fill-mode: forwards;
    border-color: #ffffff;
  }
  &__thumb--close {
    animation-name: close;
    animation-duration: 0ms;
    animation-fill-mode: forwards;
  }
}

